<!--!
This file is a part of MediaDrop (https://www.mediadrop.video),
Copyright 2009-2018 MediaDrop contributors
For the exact contribution history, see the git revision log.
The source code contained in this file is licensed under the GPLv3 or
(at your option) any later version.
See LICENSE.txt in the main project directory, for more information.
-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:py="http://genshi.edgewall.org/"
      xmlns:xi="http://www.w3.org/2001/XInclude">
<xi:include href="../settings/master.html" />
<head>
	<title>Storage Engines</title>
	<script src="${h.url_for('/scripts/third-party/squeezebox-1.1-rc4-yui-compressed.js')}" type="text/javascript"></script>
	<link href="${h.url_for('/admin/styles/squeezebox.css')}" media="screen" rel="stylesheet" type="text/css" />
	<link href="${h.url_for('/admin/styles/storage.css')}" media="screen" rel="stylesheet" type="text/css" />
	<script type="text/javascript" src="${h.url_for('/admin/scripts/modals.js')}"></script>
	<script type="text/javascript" src="${h.url_for('/admin/scripts/confirm.js')}"></script>
	<script type="text/javascript">
		//<![CDATA[
		var msg_text = {
			title: '${_('WARNING:').replace("'", "\\'")}',
			list_title: '${_('Deleting this Storage Engine (%(name)s) will:').replace("'", "\\'")}',
			delete_files: '${_('Permanently delete all of the %(num)s media files stored by this Storage Engine.').replace("'", "\\'")}',
			erase_settings: '${_('Permanently erase its settings.').replace("'", "\\'")}',
			disable: '${_('An alternative to deleting is disabling. Disabling a Storage Engine will simply prevent its use for files added from now on.').replace("'", "\\'")}',
			sure: '${_('Are you sure you want to delete this?').replace("'", "\\'")}'
		}

		function getTR(target) {
			return target.getParent('tr');
		}

		function getTDs(target) {
			return getTR(target).getElementsByTagName('td');
		}

		function getMsgText(target) {
			var numFiles = getTDs(target)[3].get('text');
			var engineName = getTDs(target)[1].get('text');

			deleteMsg = [
				'<h2>', msg_text.title, '</h2>',
				'<p>', msg_text.list_title.replace('%(name)s', engineName.trim()), '</p>',
				'<ul class="bullets">',
					'<li>', msg_text.erase_settings, '</li>',
				'</ul>',
				'<p>', msg_text.sure, '</p>',
				'<p>', msg_text.disable, '</p>'
				];

			if (parseInt(numFiles) != 0) {
				// Insert warning about the number of files that will be deleted.
				deleteMsg.splice(7, 0,
					'<li>',
					msg_text.delete_files.replace('%(num)s', numFiles),
					'</li>'
				)
			}
			return deleteMsg.join('');
		}

		window.addEvent('domready', function(){
			var addModal = new Modal('add-box');
			$('add-engine-btn').addEvent('click', function(e){
				e = new Event(e).stop();
				addModal.open();
			});

			var deleteConfirm = new DeleteConfirmMgr({
				header: '${_('Confirm Delete').replace("'", "\\'")}',
				confirmButtonText: '${_('Delete').replace("'", "\\'")}',
				cancelButtonText: '${_('Cancel').replace("'", "\\'")}',
				msg: getMsgText,
				wrapParagraph: false
			});
			deleteConfirm.openDialogHook = function(target, box, head, text, buttons, cancelButton, confirmButton) {
				// XXX: This is explicitly dependent on the structure of the table#storage-table below
				var id = getTR(target).get('id').substr(7);
				var disableLink = "${h.url_for(action='disable', id=0)}".replace('0', id);
				var disableForm = getTDs(target)[0].getElementsByTagName('form')[0];
				var disable = function(e) {
					disableForm.action = disableLink;
					disableForm.submit();
				}
				var disableButton = new Element('a', {
					'class': 'btn f-rgt',
					'style':'margin-left:20px',
					'html': '<span>${_('Disable')}</span>',
					'events': {
						'click': disable
					}
				}).inject(buttons);
				// put the confirmbutton last in the XHTML, so that the disableButton floats to the right of it.
				buttons.removeChild(confirmButton).inject(buttons);
			}

			var deleteButtons = $$$$('.delete-engine-form .delete, .delete-engine-form .delete-solo')
			deleteButtons.each(function(el) {
				el.addEvent('click', deleteConfirm.openConfirmDialog.bind(deleteConfirm));
			});
		});
		//]]>
	</script>
</head>
<body>
	<div class="box">
		<div class="box-head">
			<h1>Storage Engines</h1>
			<a id="add-engine-btn" href="${h.url_for(action='edit', id='new')}" class="btn inline f-rgt"><span>Add New Engine</span></a>
			<!--!<span class="box-head-sec">${h.doc_link('admin/settings', 'storage')}</span>-->
		</div>
		<table cellpadding="0" cellspacing="0" id="storage-table" class="status-table">
			<thead>
				<tr>
					<th id="h-status" style="width:40px">Status</th>
					<th id="h-display_name" style="width:auto">Name</th>
					<th id="h-file-size" style="width:80px;text-align:right">Disk Usage</th>
					<th id="h-file-count" style="width:70px;text-align:center">Files</th>
					<th id="h-btns" style="width:63px">&nbsp;</th>
				</tr>
			</thead>
			<tbody>
				<tr py:if="len(engines) == 0">
					<td>None Found</td>
				</tr>
				<tr py:for="engine in engines" id="engine-${engine.id}">
					<td headers="h-status" py:with="enabled = engine.enabled and _('Enabled (disable)') or _('Disabled (enable)')">
						<form action="${h.url_for(action=engine.enabled and 'disable' or 'enable', id=engine.id)}" method="post">
							<div>
								<button class="${engine.enabled and 'status-enabled' or 'status-disabled'} clickable" type="submit" value="${enabled}" title="${enabled}">${enabled}</button>
							</div>
						</form>
					</td>
					<td headers="h-display_name">
						<a href="${h.url_for(action='edit', id=engine.id)}" py:content="_(engine.display_name)" py:strip="not engine.settings_form">Display Name</a>
					</td>
					<td headers="h-file-size" style="text-align:right">${h.pretty_file_size(engine.file_size_sum)}</td>
					<td headers="h-file-count" style="text-align:center">${engine.file_count}</td>
					<td headers="h-btns" py:with="show_edit = engine.settings_form is not None; delete_class = show_edit and 'delete' or 'delete-solo'">
						<form action="${h.url_for(action='delete', id=engine.id)}" method="post" class="delete-engine-form right">
							<a py:if="show_edit" href="${h.url_for(action='edit', id=engine.id)}" class="btn table-row middle"><span>Edit</span></a><button class="btn table-row ${delete_class}" type="submit" name="delete"><span>Delete</span></button>
						</form>
					</td>
				</tr>
			</tbody>
		</table>
	</div>
	<div id="add-box" class="box hidden">
		<h1 class="box-head">Add New Engine</h1>
		<div class="box-content">
			<p>Please select what type of storage engine you would like to add:</p>
			<ul class="numbers">
				<li py:for="engine in addable_engines">
					<a href="${h.url_for(action='edit', id='new', engine_type=engine.engine_type)}">${_(engine.default_name)}</a>
				</li>
			</ul>
		</div>
		<div class="box-bottom" />
	</div>
</body>
</html>
